<template>
  <div class="install">
    <div class="box">
      <div class="ziliao" @click="geren">
        <p>个人资料</p>
        <p><img src="../../assets/img/ckgd.png"/></p>
      </div>
      <div class="gray"></div>
      <div class="quit" @click="tuichulogin">退出登录</div>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        
      }
    },
    methods: {
      // 跳转个人资料
      geren(){
        this.$router.push({path:'/personal-data'}) 
      },
      tuichulogin(){
        localStorage.removeItem("uid")
        this.$router.push('index')
      }
    },
  }
</script>

<style scoped>
.install{
  width: 100vw;
  height: 100vh;
  background: #F8F8F8;
}
.box{
  width:750px;
  background:rgba(255,255,255,1);
}
.ziliao{
  width:750px;
  height:116px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size:28px;
  font-family:PingFang SC;
  font-weight:500;
  color:rgba(51,51,51,1);
  border-top: 1px solid #EAEAEA;
  border-bottom: 1px solid #EAEAEA;
}
.ziliao p{
  margin-left: 26px;
}
.ziliao img{
  margin-right: 37px;
  width:12px;
  height:22px;
}
.gray{
  width: 100%;
  height: 41px;
  background: #F8F8F8;
}
.quit{
  width:746px;
  height:108px;
  background:rgba(255,255,255,1);
  font-size:28px;
  font-family:PingFang SC;
  font-weight:500;
  color:rgba(51,51,51,1);
  line-height:108px;
  text-align: center;
}
</style>